<template>
  <div class="livelihood-area-content">
    <Navbar title="民生事件" :fooBack="true" @back="goback" />
    <van-tabs v-model:active="activeTab" @click-tab="tabChange">
      <van-tab title="重点诉求">
        <AppealList @goPage="goPage" :list="zdgzList"></AppealList>
      </van-tab>
      <van-tab title="重点人员">
        <PeopleList @goPage="goPage" :list="keyPersonList"></PeopleList>
      </van-tab>
    </van-tabs>
  </div>
</template>

<script lang="ts" setup>
import { computed, ref, reactive, toRefs, watch, onActivated, getCurrentInstance } from 'vue'
import Navbar from '@/components/Navbar/index.vue'
import AppealList from "./components/AppealList.vue"
import PeopleList from "./components/PeopleList.vue"
import { useRoute,useRouter } from 'vue-router'
import Cookies from 'js-cookie'

import EventServe from '@/api/event'

import { useEventStore } from '@/store'
import { storeToRefs } from 'pinia'

const eventStore = useEventStore()
const { time } = storeToRefs(eventStore)

defineOptions({
  name: 'Livelihood'
})

// const time = import.meta.env.VITE_APP_MINSHENG_TIME
const activeTab = ref(0);
const route = useRoute()
const router = useRouter()


if(Cookies.get('event_tab'))
  activeTab.value = Number(Cookies.get('event_tab'))
else
  activeTab.value = Number(route.query.tab)

Cookies.remove('event_tab')

// 获取重点诉求
const zdgzList = ref([])
const getAppealData = () => {
  EventServe.getRightZdgzTableList({time: time.value}).then(res=>{
    let respData = res.data[0].data;
    zdgzList.value = respData.zdgzList
  })
}
// 获取重点人员
const keyPersonList = ref([])
const getPeopleData = () => {
  EventServe.getRightTableMap({time: time.value}).then(res=>{
    let respData = res.data[0].data;
    keyPersonList.value = respData.keyPersonList
  })
}

const tabChange = () => {
  if(activeTab.value == 0){
    getAppealData()
  }else{
    getPeopleData()
  }
}

tabChange()

const goback = () => {
  Cookies.set('event_type', '1')
  router.back()
}

const goPage = (val) => {
  let params = {}
  if(activeTab.value == 0){
    params = {
      type: "重点诉求",
      str: val.sjfl
    }
  }else{
    params = {
      type: "重点人员",
      lxfs: val.lxfs,
      ldr: val.ldr
    }
  }
  router.push({
    path: "/event/livelihood/list",
    query: params
  })
}

</script>

<script lang="ts">

</script>

<style lang="less" scoped>
.livelihood-area-content{
}
</style>
